<template>
	<view class="content">
		<view class="will" @click="change()" v-for="(xin,index) in dont" :key="index">
			<p><image :src="xin.img" mode="" style="width: 15px;height: 15px;margin-right: 10rpx;"></image>{{xin.text}}</p>
		</view>
		<view class="you" v-for="(item,index) in font" :key="index">
			<p class="h2">{{item.text1}}</p>
			<p class="h3">{{item.text2}}</p>
		</view>
		<view class="gunD" v-for="(item,index) in list1">
			<uni-notice-bar :volumeIcon="volumeIcon" :autoplay="autoplay" showIcon scrollable  :text="item.text"></uni-notice-bar>
		</view>
		<view class="shangY">
			<p class="sY">商用车</p><span class="click">点击查看专属福利</span>
		</view>
		<view class="xxx flex" v-for="(item,index) in list6">
			<dl>
				<dt>
					<image :src="item.img" mode="" style="width: 200rpx;height: 200rpx;border-radius: 100rpx;"></image>
					<dd class="font2">{{item.text1}}</dd>
				</dt>
			</dl>
			<dl>
				<dt>
					<image :src="item.img" mode="" style="width: 200rpx;height: 200rpx;border-radius: 150rpx;"></image>
					<dd class="font2">{{item.text1}}</dd>
				</dt>
			</dl>
			<dl>
				<dt>
					<image :src="item.img" mode="" style="width: 200rpx;height: 200rpx;border-radius: 150rpx;"></image>
					<dd class="font2">{{item.text1}}</dd>
				</dt>
			</dl>
		</view>
		<view class="two_p">
			<p>货车、七座以上商</p>
			<p>用车</p>
		</view>
		<view class="shangY">
			<p class="sY">非商用车</p>
		</view>
		<view class="feiS" v-for="(item,index) in list7">
			<dl>
				<dt>
					<image :src="item.img" mode="" style="width: 200rpx;height: 200rpx;border-radius: 150rpx;"></image>
					<dd class="font3">{{item.text1}}</dd>
				</dt>
			</dl>
		</view>
		<view class="btn">
			<button>下一步</button>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				dont:[{
					text:'不知道该怎么选',
					img:'../../static/wen1.png'
				}],
				font:[
					{
						text1:'选择您的车辆用途',
						text2:'您填写的所有信息，都能帮助我们，为您打造最合适的服务'
					}
				],
				list: [
									'寒雨连江夜入吴',
									'平明送客楚山孤',
									'洛阳亲友如相问',
									'一片冰心在玉壶'
								],
				
				list1: [{
					text:'寒雨连江夜入吴',
					text:'平明送客楚山孤',
					text:'洛阳亲友如相问',
					text:'一片冰心在玉壶'
				}],
				list6: [{
					text1:'物流车/商用车',
					text2:'专快车/顺风车',
					text3:'出租车',
					img:'../../static/car_03.png',
				}],
				list7: [{
					text1:'私家车',
					text2:'家用小轿车、摩托车',
					img:'../../static/car_03.png',
				}],
			}
		},
		methods:{
			change() {
				uni.navigateTo({
					url:"/pages/index/will"
				})
			}
		}
	}
</script>

<style>
	.flex{display: flex;justify-content: space-between;}
	.content{width: 90%;margin: 0 auto;}
	.will{text-align: right;padding: 20rpx;}
	.will p{font-size: 30rpx;}
	.h2{font-size: 50rpx;color: black;}
	.h3{font-size: 25rpx;margin-top: 20rpx;color: #ccc;}
	.shangY{overflow: hidden;margin: 20rpx 0;}
	.sY{font-size: 40rpx;float: left;}
	.click{display: inline-block;float: left;margin-left: 20rpx;border: red 1px dashed;padding:10rpx 15rpx;color: red;font-size: 25rpx;}
	.font2{font-size: 25rpx;text-align: center;}
	.font3{font-size: 25rpx;margin-left: 70rpx;}
	.two_p{border-bottom:1px solid #ccc;padding-bottom: 50rpx;margin-top: 50rpx;}
	.two_p p{font-size: 25rpx;color: #ccc;}
	.btn button{background-color: red;color: #fff;width: 100%;margin: 40rpx 0;}
</style>